/**
 * 
 */
XMLTTemplateSection.sectionTemplate = '<div id="section_{name}" class="section">'
	+ '<b>{name}</b> Drag and drop elements from left tree to add content<br/>'
	+ '<div id="section_body_{name}" class="sectionBody droppable"' 
	+ ' contenteditable onkeypress="setDirtyFlag(true);"></div></div>';

function XMLTTemplateSection(sectionNode) {
	var $el = $(sectionNode);
	var elements = [];
	var elementsCount = 0;
	var htmlBodyNode = null;
	
	this.getName = function() {
		return $el.attr('name');
	}
	
	this.setName = function(sName) {
		$el.attr('name', sName);
	}
	
	this.isGenerateable = function() {
		return false; //$el.attr('generateable') == 'true';
	}
	
	this.setIsGenerateable = function(bFlag) {
		return; // for now this functionality is not exposed
		$el.attr('generateable', '' + bFlag);
	}
	
	this.render = function(id) {
		var isGen = this.isGenerateable();
		$('#' + id).append($($.stringformat(XMLTTemplateSection.sectionTemplate, 
			{name: this.getName(),
			genPathDisplay: isGen? 'block' : 'none'
			})));
		if (isGen) {
			var genPathTargetNode = $('#section_genpath_' + this.getName())[0];
			var genPathNodes = $el.children('parameter')[0].childNodes;
			for (var i = 0; i < genPathNodes.length; i++) {
				renderNode(genPathNodes[i], genPathTargetNode);
			}
		}
		
		var bodyNode = $el.children('body')[0];
		if (!bodyNode) {
			return;
		}

		htmlBodyNode = $('#section_body_' + this.getName())[0];
		for (var i = 0; i < bodyNode.childNodes.length; i++) {
			renderNode(bodyNode.childNodes[i], htmlBodyNode);
		}
		
		$(htmlBodyNode).keypress(function(e) {
	        if (e.which == 13) 
	        {
	            e.preventDefault();
	            insertNodeOverSelection($('<br/>')[0], this);
	        }});
		$(htmlBodyNode).click(function(e) {
			saveSelection();
		}).keypress(function(e) {
			saveSelection();
		});
	}
	
	this.insert = function(type, sourceNode, event) {
		restoreSelection();
		var type = sourceNode.id.split('_')[0];
		var handler = SECTION_ELEMENT_HANDLERS[type];
		if (!handler) {
			alert('no handler found for type "' + type + '"');
			return;
		}
		
		var map = {
			value: ''
		};
		switch(type) {
		case 'element':
		case 'loop':
			map.value = $(sourceNode).attr('value');
		}
		handler.render(event.target, map);
	}
	
	this.getString = function() {
		var str = '<section name="' + this.getName() + '" generateable="' + this.isGenerateable() + '">';
		if (this.isGenerateable()) {
			str += '<parameter name="generationPath">';
			str += getInnerString($('#section_genpath_' + this.getName())[0]);
			str += '</parameter>';
		}
		str += '<body>';
		str += getInnerString($('#section_body_' + this.getName())[0]);
		str += '</body></section>';
		return str;
	}
	

	var savedRange, isInFocus;
	function saveSelection() {
		if (window.getSelection) {
			savedRange = window.getSelection().getRangeAt(0);
		} else if (document.selection) {
			savedRange = document.selection.createRange();
		}
	}

	function restoreSelection() {
		if (savedRange != null) {
			if (window.getSelection) {
				var s = window.getSelection();
				if (s.rangeCount > 0)
					s.removeAllRanges();
				s.addRange(savedRange);
			} else if (document.createRange) {
				window.getSelection().addRange(savedRange);
			} else if (document.selection) {
				savedRange.select();
			}
		}
	}
	
}

